<template>
  <el-row>
    <el-col :span="5">
      <basic-container>
        <el-menu
          class="el-menu-vertical-demo"
          @select="handleSelect">
          <el-menu-item v-for="item in menuData" :index="item.id" :key="item.id">
            <i class="el-icon-star-off"/>
            <span slot="title">{{ item.modelName }}</span>
          </el-menu-item>
        </el-menu>
      </basic-container>
    </el-col>
    <el-col :span="19">
      <basic-container>
        <avue-crud :option="option"
                   :table-loading="loading"
                   :data="data"
                   ref="crud"
                   v-model="form"
                   :page.sync="page"
                   @search-change="searchChange"
                   @search-reset="searchReset"
                   @selection-change="selectionChange"
                   @current-change="currentChange"
                   @size-change="sizeChange"
                   @refresh-change="refreshChange"
                   @row-del="rowDel"
                   @on-load="onLoad">
          <template slot-scope="{row}" slot="menu">
            <el-button type="text"
                       size="small"
                       plain
                       icon="el-icon-view"
                       class="none-border"
                       @click.stop="view(row)">查 看
            </el-button>
            <el-button type="text"
                       size="small"
                       plain
                       icon="el-icon-edit"
                       class="none-border"
                       @click.stop="edit(row)">编 辑
            </el-button>
            <el-button type="text"
                       size="small"
                       plain
                       icon="el-icon-video-play"
                       class="none-border"
                       @click.stop="trigger(row)">执 行
            </el-button>
            <el-button type="text"
                       size="small"
                       plain
                       icon="el-icon-delete"
                       class="none-border"
                       @click.stop="rowDel(row)">删 除
            </el-button>
          </template>
          <template slot="menuLeft">
            <el-button type="primary" size="small" icon="el-icon-plus" v-if="!validatenull(currentModelId)"
                       @click="startEdit">
              新 增
            </el-button>
            <el-button type="danger" size="small" icon="el-icon-plus" plain
                       @click="handleDelete">
              删 除
            </el-button>
          </template>
        </avue-crud>
      </basic-container>
      <div v-if="editByStep">
        <el-dialog append-to-body
                   :visible.sync="editByStep"
                   width="60%"
                   :before-close="editByStepClose">
        <span slot="title">
          <el-steps :active="active" simple style="margin-right: 40%">
          <el-step title="基础信息" icon="el-icon-view"></el-step>
          <el-step title="质检规则" icon="el-icon-tickets"></el-step>
          <el-step title="结果通知" icon="el-icon-document-copy"></el-step>
          </el-steps>
        </span>

          <div v-if="0==active">
            <avue-form ref="form"
                       v-model="form"
                       :option="firstStepOption">
              <template slot="cycle" slot-scope="scope">
                <el-col :span="12">
                  <el-select v-model="form.cycle" @change="resetCycleInfo">
                    <el-option v-for="item in cycleDic"
                               :key="item.dictKey"
                               :label="item.dictValue"
                               :value="item.dictKey"></el-option>
                  </el-select>
                </el-col>
                <el-col :span="12" v-if="form.cycle=='1'">
                  <el-date-picker
                    popper-class="once_date_picker"
                    v-model="form.datetime"
                    type="datetime"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    :picker-options="oncePickerOption">
                  </el-date-picker>
                </el-col>
                <el-col :span="12" v-if="form.cycle=='2'">
                  <el-time-picker
                    v-model="form.time" value-format="HH:mm:ss"></el-time-picker>
                </el-col>
                <el-col :span="6" v-if="form.cycle=='3'">
                  <el-select v-model="form.week">
                    <el-option value="1" label="周一"></el-option>
                    <el-option value="2" label="周二"></el-option>
                    <el-option value="3" label="周三"></el-option>
                    <el-option value="4" label="周四"></el-option>
                    <el-option value="5" label="周五"></el-option>
                    <el-option value="6" label="周六"></el-option>
                    <el-option value="7" label="周日"></el-option>
                  </el-select>
                </el-col>
                <el-col :span="6" v-if="form.cycle=='3'">
                  <el-time-picker v-model="form.time" value-format="HH:mm:ss"></el-time-picker>
                </el-col>
                <el-col :span="6" v-if="form.cycle=='4'">
                  <el-select v-model="form.date" @change="dateWarn">
                    <el-option value="1" label="1日"></el-option>
                    <el-option value="2" label="2日"></el-option>
                    <el-option value="3" label="3日"></el-option>
                    <el-option value="4" label="4日"></el-option>
                    <el-option value="5" label="5日"></el-option>
                    <el-option value="6" label="6日"></el-option>
                    <el-option value="7" label="7日"></el-option>
                    <el-option value="8" label="8日"></el-option>
                    <el-option value="9" label="9日"></el-option>
                    <el-option value="10" label="10日"></el-option>
                    <el-option value="11" label="11日"></el-option>
                    <el-option value="12" label="12日"></el-option>
                    <el-option value="13" label="13日"></el-option>
                    <el-option value="14" label="14日"></el-option>
                    <el-option value="15" label="15日"></el-option>
                    <el-option value="16" label="16日"></el-option>
                    <el-option value="17" label="17日"></el-option>
                    <el-option value="18" label="18日"></el-option>
                    <el-option value="19" label="19日"></el-option>
                    <el-option value="20" label="20日"></el-option>
                    <el-option value="21" label="21日"></el-option>
                    <el-option value="22" label="22日"></el-option>
                    <el-option value="23" label="23日"></el-option>
                    <el-option value="24" label="24日"></el-option>
                    <el-option value="25" label="25日"></el-option>
                    <el-option value="26" label="26日"></el-option>
                    <el-option value="27" label="27日"></el-option>
                    <el-option value="28" label="28日"></el-option>
                    <el-option value="29" label="29日"></el-option>
                    <el-option value="30" label="30日"></el-option>
                    <el-option value="31" label="31日"></el-option>
                  </el-select>
                </el-col>
                <el-col :span="6" v-if="form.cycle=='4'">
                  <el-time-picker v-model="form.time" value-format="HH:mm:ss"></el-time-picker>
                </el-col>
                <el-col :span="4" v-if="form.cycle=='5'">
                  <el-select v-model="form.month" @change="determineDateDic" placeholder="月">
                    <el-option value="1" label="1月"></el-option>
                    <el-option value="2" label="2月"></el-option>
                    <el-option value="3" label="3月"></el-option>
                    <el-option value="4" label="4月"></el-option>
                    <el-option value="5" label="5月"></el-option>
                    <el-option value="6" label="6月"></el-option>
                    <el-option value="7" label="7月"></el-option>
                    <el-option value="8" label="8月"></el-option>
                    <el-option value="9" label="9月"></el-option>
                    <el-option value="10" label="10月"></el-option>
                    <el-option value="11" label="11月"></el-option>
                    <el-option value="12" label="12月"></el-option>
                  </el-select>
                </el-col>
                <el-col :span="4" v-if="form.cycle=='5'">
                  <el-select v-model="form.date" @change="tipAndRefreshTime" placeholder="日">
                    <el-option v-for="item in dateDic"
                               :key="item.value"
                               :label="item.label"
                               :value="item.value"></el-option>
                  </el-select>
                </el-col>
                <el-col :span="4" v-if="form.cycle=='5'">
                  <el-time-picker
                    v-model="form.time" value-format="HH:mm:ss"></el-time-picker>
                </el-col>
              </template>
            </avue-form>
          </div>
          <div v-if="1==active">
            <avue-crud :option="qualityTestingRuleOption"
                       :data="form.qualityTestingRuleData"
                       @selection-change="selectionRulesChange"
                       ref="ruleCrud">
              <template slot="menuLeft">
                <el-button type="primary" size="small" icon="el-icon-plus"
                           @click="startChooseRule">
                  新 增
                </el-button>
                <el-button type="danger" size="small" icon="el-icon-delete" plain
                           @click="deleteRules">
                  删 除
                </el-button>
              </template>
              <template slot-scope="scope" slot="menu">
                <el-button size="small" type="danger" icon="el-icon-delete" circle plain
                           @click.stop="deleteRule(scope.row)"></el-button>
              </template>
            </avue-crud>
          </div>
          <div v-if="active==2">
            <avue-form :option="notifyOption" v-model="form" ref="ruleForm">
              <template slot="notify" slot-scope="scope">
                <el-radio-group v-model="form.notify" @change="changeIfNeedNotifyUser">
                  <el-radio label="1">是</el-radio>
                  <el-radio label="0">否</el-radio>
                </el-radio-group>
              </template>
            </avue-form>
          </div>
          <!--    嵌套的对话框，第二步的新增      -->
          <div v-if="startChoose">
            <el-dialog append-to-body
                       :visible.sync="startChoose"
                       width="60%"
                       :before-close="chooseClose">
              <avue-form :option="ruleOption" v-model="form" @submit="fillRuleData"></avue-form>
            </el-dialog>
          </div>
          <el-footer style="text-align: right;margin-top: 15px">
            <el-button type="primary"
                       icon="el-icon-bottom"
                       size="small"
                       v-if="0==active"
                       @click="chooseQualityTestingRule"
            >下一步
            </el-button>
            <el-button type="primary"
                       icon="el-icon-top"
                       size="small"
                       v-if="1==active"
                       @click="active=active-1"
            >上一步
            </el-button>
            <el-button type="primary"
                       icon="el-icon-bottom"
                       size="small"
                       v-if="1==active"
                       @click="active+=1"
            >下一步
            </el-button>
            <el-button type="primary"
                       icon="el-icon-top"
                       size="small"
                       v-if="2==active"
                       @click="active=active-1"
            >上一步
            </el-button>
            <el-button type="primary"
                       icon="el-icon-finished"
                       size="small"
                       v-if="type=='add'&&2==active"
                       @click="submitProgramme"
            >提 交
            </el-button>
            <el-button type="primary"
                       icon="el-icon-finished"
                       size="small"
                       v-if="type=='edit'&&2==active"
                       @click="updateProgramme"
            >提 交
            </el-button>
            <el-button icon="el-icon-circle-close"
                       size="small"
                       plain
                       @click="editByStepClose"
            >取 消
            </el-button>
          </el-footer>
        </el-dialog>
      </div>
    </el-col>

    <div v-if="viewDetail">
      <el-dialog title="查 看"
                 append-to-body
                 :visible.sync="viewDetail" width="70%" :before-close="viewClose">
        <programme_view :form="form"
        ></programme_view>
        <div slot="footer" class="dialog-footer"></div>
      </el-dialog>
    </div>
    <div v-if="triggerJob">
      <el-dialog title="执行任务" append-to-body :visible.sync="triggerJob" width="30%" :before-close="triggerJobClose">
        <avue-form :option="triggerOption" v-model="triggerParam" ref="triggerForm">
          <template slot="statisticalCycle" slot-scope="scope">
            <div v-if="statisticalType=='year'">
              <el-date-picker
                v-model="triggerParam.statisticalCycle"
                type="year"
                value-format="yyyy-MM-dd"
                placeholder="选择年"
                :picker-options="pickerOptions">
              </el-date-picker>
            </div>
            <div v-if="statisticalType=='month'">
              <el-date-picker
                v-model="triggerParam.statisticalCycle"
                type="month"
                value-format="yyyy-MM-dd"
                placeholder="选择月"
                :picker-options="pickerOptions">
              </el-date-picker>
            </div>
            <div v-if="statisticalType=='date'">
              <el-date-picker
                v-model="triggerParam.statisticalCycle"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择日期"
                :picker-options="pickerOptions">
              </el-date-picker>
            </div>
            <div v-if="statisticalType=='quarter'">
              <jdSelect @getValue="changeCycle"></jdSelect>
            </div>
          </template>
        </avue-form>

        <div slot="footer" class="dialog-footer">
          <el-button icon="el-icon-close" size="small" @click="triggerJobClose"></el-button>
          <el-button type="primary" icon="el-icon-check" size="small" @click="triggerJobSubmit"></el-button>
        </div>
      </el-dialog>
    </div>
  </el-row>
</template>

<script>
import {validatenull} from "@/util/validate"
import {
  getPageList,
  saveQualityTestingProgramme,
  removeQualityTestingProgramme,
  removeQualityTestingProgrammes,
  trigger,
  getDetailById,
  updateQualityTestingProgramme
} from "@/api/data_quality/quality_testing_programme"
import {modelList, getThemeRuleTree, getStatisticalType} from "@/api/data_quality/business_model"
import {getDictionary} from '@/api/system/dictbiz'
import {getRules} from '@/api/data_quality/manage_rule'
import programme_view from "./programme_view";
import jdSelect from "./jdSelect";

export default {
  name: "programme_list",
  components: {programme_view, jdSelect},
  data() {
    const that = this;
    const cycleValidate = (rule, value, callback) => {
      if (value == '1' && validatenull(that.form.datetime)) {
        callback(new Error("请选择执行的具体时间！"))
      }
      if (value == '2' && validatenull(that.form.time)) {
        callback(new Error("请选择执行的具体时间！"))
      }
      if (value == '3') {
        if (validatenull(that.form.week)) {
          callback(new Error("请选择周几执行！"))
        }
        if (validatenull(that.form.time)) {
          callback(new Error("请选择执行的具体时间！"))
        }
      }
      if (value == '4') {
        if (validatenull(that.form.date)) {
          callback(new Error("请选择执行日期！"))
        }
        if (validatenull(that.form.time)) {
          callback(new Error("请选择执行的具体时间！"))
        }
      }
      if (value == '5') {
        if (validatenull(that.form.month)) {
          callback(new Error("请选择执行月份！"))
        }
        if (validatenull(that.form.date)) {
          callback(new Error("请选择执行日期！"))
        }
        if (validatenull(that.form.time)) {
          callback(new Error("请选择执行的具体时间！"))
        }
      }
      callback();
    };
    return {
      type: '',
      menuData: [],
      form: {
        time: '',
        week: '',
        datetime: '',
        month: '',
        date: '',
        qualityTestingRuleData: [],
        choseRule: '',
        notify: '1',
        modelId: ''
      },
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0
      },
      selectionList: [],
      option: {
        calcHeight: 30,
        dialogWidth: 900,
        labelWidth: 140,
        tip: false,
        searchShow: true,
        searchMenuSpan: 6,
        border: true,
        index: true,
        viewBtn: false,
        selection: true,
        dialogClickModal: false,
        saveBtn: false,
        cancelBtn: false,
        delBtn: false,
        updateBtn: false,
        indexLabel: '序号',
        editBtn: false,
        addBtn: false,
        columnBtn: false,
        refreshBtn: false,
        menuWidth: 250,
        column: [
          {
            label: "方案名称",
            prop: "name",
          },
          {
            label: "执行周期",
            prop: "cycleStr",
          },
          {
            label: "创建时间",
            prop: "createTime",
          },
        ]
      },
      data: [],
      currentModelId: '',
      editByStep: false,
      active: 0,
      firstStepOption: {
        calcHeight: 30,
        dialogWidth: 900,
        tip: false,
        searchShow: true,
        searchMenuSpan: 6,
        border: true,
        index: true,
        viewBtn: false,
        selection: true,
        dialogClickModal: false,
        saveBtn: false,
        cancelBtn: false,
        delBtn: false,
        updateBtn: false,
        indexLabel: '序号',
        addTitle: '基础信息',
        submitBtn: false,
        emptyBtn: false,
        labelWidth: 140,
        column: [
          {
            label: "方案名称",
            prop: "name",
            rules: [
              {
                required: true,
                message: "请输入方案名称",
                trigger: "blur"
              },
            ]
          },
          {
            label: "同步上期例外",
            prop: "sync",
            type: 'radio',
            dicData: [
              {
                label: "是",
                value: '1'
              },
              {
                label: "否",
                value: '0'
              }
            ],
            rules: [
              {
                required: true,
                message: "请选择是否同步上期例外",
                trigger: "blur"
              },
            ],
            value: '0',
          },
          {
            label: "计划任务",
            prop: "planTask",
            type: 'radio',
            dicData: [
              {
                label: "启用",
                value: '1'
              },
              {
                label: "禁用",
                value: '0'
              }
            ],
            rules: [
              {
                required: true,
                message: "请选择是否启用计划任务",
                trigger: "blur"
              },
            ],
            value: '1',
          },
          {
            label: "执行周期",
            prop: "cycle",
            formslot: true,
            span: 24,
            rules: [
              {
                required: true,
                message: "请选择执行周期",
                trigger: "blur"
              },
              {
                validator: cycleValidate,
                trigger: "blur"
              }
            ]
          },
          {
            label: "方案描述",
            prop: "description",
            span: 24,
            minRows: 3,
            hide: true,
            type: "textarea",
            maxlength: 1000,
            showWordLimit: true
          },
        ]
      },
      cycleDic: [],
      oncePickerOption: {
        disabledDate(time) {
          return time.getTime() < Date.now();
        },
      },
      dateDic: [],
      qualityTestingRuleOption: {
        enter: false,
        calcHeight: 30,
        labelWidth: 110,
        tip: false,
        searchShow: true,
        searchMenuSpan: 6,
        border: true,
        index: true,
        indexLabel: '序号',
        selection: true,
        viewBtn: false,
        editBtn: false,
        delBtn: false,
        addBtn: false,
        saveBtn: false,
        cancelBtn: false,
        dialogClickModal: false,
        columnBtn: false,
        refreshBtn: false,
        searchShowBtn: false,
        submitBtn: false,
        emptyBtn: true,
        menuWidth: 80,
        column: [
          {
            label: "主题表",
            prop: "themeId",
            dicUrl: "/api/data-quality/themeTable/getTitleIdList",
            props: {
              label: "title",
              value: "id"
            },
            type: 'select'
          },
          {
            label: "规则代码",
            prop: "code",
          },
          {
            label: "规则描述",
            prop: "describe",
          },
          {
            label: "规则类型",
            prop: "type",
            type: 'select',
            dicUrl: "/api/blade-system/dict-biz/dictionary?code=rule_type",
            props: {
              label: "dictValue",
              value: "dictKey"
            },
            span: 24,
          },
          {
            label: "问题级别",
            prop: "problemLevel",
            type: 'select',
            dicUrl: "/api/blade-system/dict-biz/dictionary?code=problem_level",
            props: {
              label: "dictValue",
              value: "dictKey"
            },
            dataType: 'number'
          },
          {
            label: "权重",
            prop: "weight",
          },
          {
            label: '创建时间',
            prop: 'createTime',
          },
        ]
      },
      qualityTestingRuleData: [],
      startChoose: false,
      ruleOption: {
        column: [
          {
            label: "质检规则",
            prop: "choseRule",
            type: 'tree',
            dicData: [],
            props: {
              label: 'title',
              value: 'id'
            },
            multiple: true,
            leafOnly: true,
            span: 24,
            dataType: 'string'
          }
        ]
      },
      rulesIndex: [],
      notifyOption: {
        submitBtn: false,
        emptyBtn: false,
        column: [
          {
            label: '是否通知',
            prop: 'notify',
            type: 'radio',
            formslot: true,
            value: '1',
            dicData: [
              {
                label: "是",
                value: '1'
              },
              {
                label: "否",
                value: '0'
              }
            ]
          },
          {
            label: '被通知人',
            prop: 'notifyUser',
            type: 'tree',
            dicUrl: 'api/blade-user/userTree',
            props: {
              label: "name",
              value: "id"
            },
            leafOnly: true,
            multiple: true,
            dataType: 'string',
            rules: [
              {
                required: true,
                message: "请选择被通知人",
                trigger: "blur"
              },
            ],
          }
        ]
      },
      viewDetail: false,
      triggerJob: false,
      statisticalType: '',
      triggerParam: {
        statisticalCycle: '',
      },
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() >= Date.now();
        },
      },
      triggerOption: {
        submitBtn:false,
        emptyBtn:false,
        column: [
          {
            label: '质检周期',
            prop: 'statisticalCycle',
            formslot: true,
            rules: [
              {
                required: true,
                message: "请选择质检周期",
                trigger: "blur"
              }
            ],
            span:22,
          }
        ]
      },
    }
  },
  computed: {
    ids() {
      let ids = [];
      this.selectionList.forEach(ele => {
        ids.push(ele.id);
      });
      return ids.join(",");
    }
  },
  mounted() {
    modelList().then(res => {
      this.menuData = res.data.data;
    })
  },
  methods: {
    triggerJobSubmit() {
      this.$refs.triggerForm.validate((valid, done)=>{
        if(valid){
          trigger(this.triggerParam).then(() => {
            this.$message({
              type: "success",
              message: "操作成功，请稍后查询执行结果!"
            });
          });
          this.triggerJobClose();
        }
        done();
      })

    },
    changeCycle(val) {
      this.triggerParam.statisticalCycle = val;
    },
    triggerJobClose() {
      this.triggerJob = false;
      this.triggerParam = {
        statisticalCycle: '',
      };
    },
    viewClose() {
      this.viewDetail = false;
    },
    view(row) {
      getDetailById(row.id).then(res => {
        this.form = res.data.data;
        this.viewDetail = true;
      })
    },
    edit(row) {
      getDetailById(row.id).then(res => {
        getDictionary({code: 'execution_cycle'}).then(dictRes => {
          this.cycleDic = dictRes.data.data;
        })
        if (res.data.data.cycle == '5') {
          this.determineDateDic(res.data.data.month);
        }
        this.form = res.data.data;
        this.type = 'edit';
        this.editByStep = true;
      })
    },
    trigger(row) {
      getStatisticalType(row.modelId).then(res => {
        this.statisticalType = res.data.data;
        this.triggerJob = true;
      })
      this.triggerParam = row;
    },
    updateProgramme() {
      this.$refs.ruleForm.validate((valid, done) => {
        if (valid) {
          updateQualityTestingProgramme(this.form).then(() => {
            this.$message({
              message: '提交成功！',
              type: 'success'
            });
          });
          this.editByStepClose();
          this.onLoad(this.page);
          done();
        }
      })
    },
    submitProgramme() {
      this.$refs.ruleForm.validate((valid, done) => {
        if (valid) {
          this.form.modelId = this.currentModelId;
          saveQualityTestingProgramme(this.form).then(() => {
            this.$message({
              message: '提交成功！',
              type: 'success'
            });
          });
          this.editByStepClose();
          this.onLoad(this.page);
          done();
        }
      })
    },
    changeIfNeedNotifyUser(val) {
      let notifyUser = this.findObject(this.notifyOption.column, "notifyUser");
      if (val == '1') {
        notifyUser.rules = [{
          required: true,
          message: "请选择被通知人",
          trigger: "blur"
        }]
      } else {
        notifyUser.rules = [{
          required: false,
          message: "请选择被通知人",
          trigger: "blur"
        }]
      }
    },
    selectionRulesChange(list) {
      let indexes = [];
      list.forEach((item) => {
        indexes.push(item.$index);
      })
      //需要从后往前删
      indexes.sort();
      indexes.reverse();
      this.rulesIndex = indexes;
    },
    deleteRules() {
      this.rulesIndex.forEach(item => {
        this.form.qualityTestingRuleData.splice(item, 1)
      })
    },
    deleteRule(row) {
      this.form.qualityTestingRuleData.splice(row.$index, 1)
    },
    fillRuleData(form, done) {
      getRules(form.choseRule).then(res => {
        this.form.qualityTestingRuleData = res.data.data;
      })
      done();
      this.chooseClose();
    },
    chooseClose() {
      this.startChoose = false;
    },
    startChooseRule() {
      if (this.type == 'add') {
        getThemeRuleTree(this.currentModelId).then(res => {
          this.ruleDic = res.data.data;
          let choseRule = this.findObject(this.ruleOption.column, "choseRule");
          choseRule.dicData = res.data.data;
          this.startChoose = true;
        })
      } else if (this.type == 'edit') {
        getThemeRuleTree(this.form.modelId).then(res => {
          this.ruleDic = res.data.data;
          let choseRule = this.findObject(this.ruleOption.column, "choseRule");
          choseRule.dicData = res.data.data;
          this.startChoose = true;
        })
      }

    },
    chooseQualityTestingRule() {
      this.$refs.form.validate((valid, done) => {
        if (valid) {
          this.active = 1;
          done();
        }
      })
    },
    tipAndRefreshTime(val) {
      this.form.time = '';
      if ((!validatenull(val)) && val == '29' && this.form.month == '2') {
        this.$message({
          message: '平年2月将不执行本质检方案！',
          type: 'warning'
        });
      }
    },
    determineDateDic(val) {
      this.form.date = '';
      this.form.time = '';
      let dates = [];
      let j;
      if (val == '1' || val == '3' || val == '5' || val == '7' || val == '8' || val == '10' || val == '12') {
        j = 31;
      } else if (val == '2') {
        j = 29;
      } else if (val == '4' || val == '6' || val == '9' || val == '11') {
        j = 30;
      }
      for (let i = 1; i <= j; i++) {
        let item = {value: i.toString(), label: i + '日'}
        dates.push(item);
      }
      this.dateDic = dates;
    },
    resetCycleInfo() {
      this.form.time = '';
      this.form.week = '';
      this.form.datetime = '';
      this.form.month = '';
      this.form.date = '';
    },
    dateWarn(val) {
      if (!validatenull(val)) {
        if (val == '29') {
          this.$message({
            message: '平年2月将不执行本质检方案！',
            type: 'warning'
          });
        } else if (val == '30') {
          this.$message({
            message: '2月份将不执行本质检方案！',
            type: 'warning'
          });
        } else if (val == '31') {
          this.$message({
            message: '2、4、6、9、11月份将不执行本质检方案！',
            type: 'warning'
          });
        }
      }
    },
    startEdit() {
      this.type = 'add';
      getDictionary({code: 'execution_cycle'}).then(res => {
        this.cycleDic = res.data.data;
      })
      this.editByStep = true;
    },
    editByStepClose() {
      this.form = {
        time: '',
        week: '',
        datetime: '',
        month: '',
        date: '',
        qualityTestingRuleData: [],
        choseRule: [],
        notify: '1'
      };
      this.editByStep = false;
      this.active = 0;
      this.type = '';
    },
    handleSelect(index) {
      this.query.modelId = index;
      this.currentModelId = index;
      this.page.currentPage = 1;
      this.onLoad(this.page);
    },
    rowDel(row) {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          return removeQualityTestingProgramme(row.id);
        })
        .then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!"
          });
        });
    },
    handleDelete() {
      if (this.selectionList.length === 0) {
        this.$message.warning("请选择至少一条数据");
        return;
      }
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          return removeQualityTestingProgrammes(this.ids);
        })
        .then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!"
          });
          this.$refs.crud.toggleSelection();
        });
    },
    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },
    selectionChange(list) {
      this.selectionList = list;
    },
    selectionClear() {
      this.selectionList = [];
      this.$refs.crud.toggleSelection();
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      getPageList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        this.loading = false;
        this.selectionClear();
      });
    }
  }
}
</script>

<style scoped>
/deep/ .el-steps--simple {
  padding: 0 !important;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0);
}

/deep/ .el-step__title.is-process {
  font-weight: 700;
  color: #409EFF;
}

/deep/ .el-step__head.is-process {
  color: #409EFF;
  border-color: #303133;
}

/deep/ .el-step__title.is-finish {
  color: #67C23A;
}

/deep/ .el-step__head.is-finish {
  color: #67C23A;
  border-color: #67C23A;
}
</style>
